<!DOCTYPE html>
<html lang="en">
<head>
    <base href="/">
    <meta charset="UTF-8">
    <title>房间管理</title>
    <link rel="stylesheet" href="lib/layui/css/layui.css">
</head>
<body>

<table class="layui-table"
       lay-data="{ url:'room/getList', page:true, id:'datalist',toolbar:'#top_toolbar'}"
       lay-filter="datalist">
    <thead>
    <tr>
        <th lay-data="{field:'id', sort:true}">ID</th>
        <th lay-data="{field:'code',sort:true}">房间号</th>
        <th lay-data="{templet:'#statetext'}">状态</th>
        <th lay-data="{toolbar:'#line_toolbar'}">操作</th>

    </tr>
    </thead>
</table>
<!--	END数据表格-->


<!--Start 新增窗口-->
<div id="room_addwin" style="display: none;" class="layui-form" lay-filter="room_addwin">
    <form id="room_addform">
        <div class="layui-form-item">
            <label class="layui-form-label">房间号</label>
            <div class="layui-input-inline">
                <input type="text" lay-verify="required|room_test" name="code" class="layui-input">
            </div>
        </div>
        <!-- <div class="layui-form-item">
             <label class="layui-form-label">状态</label>
             <div class="layui-input-inline">
                 <input type="text" lay-verify="required" name="state" class="layui-input">
             </div>
         </div>-->
    </form>
</div>

<!--END 新增-->
<!--Start 编辑窗口-->
<div id="room_editwin" style="display: none;" class="layui-form" lay-filter="room_editwin">
    <input type="hidden" name="id">
    <div class="layui-form-item">
        <label class="layui-form-label">房间号</label>
        <div class="layui-input-inline">
            <input type="text" lay-verify="required|room_test" name="code" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">状态</label>
        <div class="layui-input-inline">
            <!--            <input type="text" lay-verify="required" name="state" class="layui-input">-->
            <select name="state" lay-verify="required">
                <option value="">请选择一个状态</option>
                <option value="0">可入住</option>
                <option value="1">已预定</option>
                <option value="2">已入住</option>
                <option value="3">正在维修</option>
            </select>
        </div>
    </div>
</div>
<!--END 编辑-->
<script type="text/html" id="statetext">
    {{#  if(d.state==0){ }}
    <span class="layui-badge layui-bg-blue">可入住</span>
    {{#  } else if(d.state==1){ }}
    <span class="layui-badge layui-bg-orange">已预定</span>
    {{#  } else if(d.state==2) { }}
    <span class="layui-badge layui-bg-cyan">已入住</span>

    {{#  } else { }}
    <span class="layui-badge ">维修中</span>
    {{#  } }}

</script>
<script type="text/html" id="line_toolbar">
    <a class="layui-btn  layui-btn-sm layui-btn-radius" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-sm layui-btn-radius layui-btn-danger" lay-event="del" style="margin-left:0.8px">删除</a>
    {{#  if(d.state==0){ }}

    {{#  } else if(d.state==1|d.state==2){ }}
    <a class="layui-btn layui-btn-sm layui-btn-radius layui-btn-warm" lay-event="order" style="margin-left:0.8px">详情</a>
    {{#  } }}

</script>
<script type="text/html" id="top_toolbar">
    <div class="layui-input-inline">
        <input type="text" name="check" class="layui-input" placeholder="查询">
    </div>
    <button class="layui-btn layui-btn" lay-event="check" style="background-color:#01AAED">查询</button>
    <button class="layui-btn layui-btn" lay-event="add" style="background-color:#FFB800">添加</button>

</script>

<script type="text/html" id="line_toolbar1">
    <a class="layui-btn  layui-btn-sm layui-btn-radius" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-sm layui-btn-radius layui-btn-danger" lay-event="del" style="margin-left:0.8px">删除</a>
</script>
<script src="lib/layui/layui.all.js"></script>
<!-- 声明layui需要的对象 -->
<script src="js/layuibase.js"></script>
<script src="js/room.js"></script>

</body>
</html>